@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800;900&family=Poppins:wght@300;400;500;600;900&family=Quicksand:wght@300;400;500;600;700&family=Shizuru&display=swap);
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}
/* font */
.fs-0 {font-size: 2.5rem;}
.fs-24 {font-size: 1.5em;}
.fs-22 {font-size: 1.375em;}
.fs-20 {font-size: 1.25em;}
.fs-18 {font-size: 1.125em;}
.fs-16 {font-size: 1em;}
.fs-14 {font-size: 14px;}
.fs-12 {font-size: 12px;}
.fs-10 {font-size: 10px;}
.fs-8 {font-size: 8px;}
/* dimention */
.w-100 {width: 100%;}
.h-100 {height: 100%;}
.gap-10 {gap: 10px}
.gap-15 {gap: 15px}
.gap-20 {gap: 20px}
/* grid flex */
.d-none {display: none;}
.d-flex {display: flex;}
.df-fwn {display: flex;flex-wrap: nowrap;}
.df-fww {display: flex;flex-wrap: wrap;}
.df-jcc {display: flex;justify-content: center;}
.df-aic {display: flex;align-items: center;}
.df-jcc-fww {display: flex;justify-content: center;flex-wrap: wrap;}
.df-aic-fww {display: flex;align-items: center;flex-wrap: wrap;}
.df-fdc {display: flex;flex-direction: column;}
.df-jcc-aic {display: flex;justify-content: center;align-items: center;}
.df-jcsb-aic {display: flex;justify-content: space-between;align-items: center;}
.df-jcc-aic-fww {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
.df-jcsb-aic-fww {display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;}
.df-fdc-aic {display: flex;flex-direction: column;align-items: center;}
.df-fdc-jcc {display: flex;flex-direction: column;justify-content: center;}
.df-fdc-jcc-aic {display: flex;flex-direction: column;justify-content: center;align-items: center;}

::-webkit-scrollbar {
    width: 7px;
    height: 5px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 5px;  
}
.scroller {
    scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
    scrollbar-width: thin;
}
 /* div {
    border: 2px solid red;
    margin: 2px;
}
span,h1, h2, h3,h4,h5,h6{
    border: 2px solid rgb(51, 255, 0);
    margin: 2px;
} */
html{
    height: 100%;
    width: 100%;
    /* background: radial-gradient( #c4e1c5,#78bb7b); */
    background-attachment: fixed;
}
body{
    width: 100%;
    height: 100%;
    font-family: 'Poppins', sans-serif;
    overflow: hidden;
    background: linear-gradient(0deg, rgb(147, 89, 251), rgb(77, 10, 183));
}
.application {
    position: relative;
    overflow: hidden;
}